﻿<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/main_1.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/lodash.js"></script>
<script type="text/javascript" src="js/waypoint.js"></script>
<script type="text/javascript" src="js/jquery.lazyload.min.js"></script>
<script type="text/javascript" src="js/chart-list-data-gl.js"></script>
<script type="text/javascript" src="js/selection.js"></script>

<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-table.js"></script>
<script src="js/bootstrap-table-zh-CN.js"></script>
!-- 引入bootstrap样式 -->
<link
	href="https://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css"
	rel="stylesheet">
<!-- 引入bootstrap-table样式 -->
<link
	href="https://cdn.bootcss.com/bootstrap-table/1.11.1/bootstrap-table.min.css"
	rel="stylesheet">

<!-- jquery -->
<script src="https://cdn.bootcss.com/jquery/2.2.3/jquery.min.js"></script>
<script
	src="https://cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<!-- bootstrap-table.min.js -->
<script
	src="https://cdn.bootcss.com/bootstrap-table/1.11.1/bootstrap-table.min.js"></script>
<!-- 引入中文语言包 -->
<script
	src="https://cdn.bootcss.com/bootstrap-table/1.11.1/locale/bootstrap-table-zh-CN.min.js"></script>

<title>job</title>

</head>
<body>
	<nav class="navbar navbar-default navbar-fixed-top">
		<div class="container-fluid">
			<div class="navbar-header">
				<button type="button" data-toggle="collapse"
					data-target="#navbar-collapse" aria-expanded="false"
					class="navbar-toggle collapsed">
					<span class="sr-only">Toggle navigation</span><span
						class="icon-bar"></span><span class="icon-bar"></span><span
						class="icon-bar"></span>
				</button>
				Joblabx
			</div>
			<div id="navbar-collapse" class="collapse navbar-collapse">

				<ul class="nav navbar-nav navbar-right">

					<li id="nav-homeen"><a
						href="https://ecomfe.github.io/echarts-doc/public/en/index.html">JOBLABX</a>
					</li>
				</ul>
			</div>
		</div>
	</nav>
	<div id="left-chart-nav">
		<ul>
			<li><a href="default.html">搜索匹配</a>
			</li>
			<li><a href="line-simple.html">数据统计</a>
			</li>
			<li><a href="789.html">数据地图</a>
			</li>

		</ul>
	</div>
	<div class="container" style="margin-top: 5%;width: 52%;">
		<div class="row">
			<div class="col-xs-12 ">
				<input type="text" name="location" class="form-control" value="大学城市">
			</div>
			<div class="col-xs-12 ">
				<input type="text" id="dx" name="university" class="form-control"
					value="大学">
			</div>
			<div class="col-xs-12">
				<input type="button" onclick="ajaxAction()" class="btn btn-info"
					value="查询">
			</div>
		</div>
	</div>
	<div class="main"
		style="width: 72%;margin-left: 20%;margin-top: 5%;height: 180%">
		<table id="table" style="text-align: center;height: 80%"></table>
	</div>
	<script type="text/javascript">
		//生成表格
		function ajaxAction() {
			$('#table').bootstrapTable('destroy');
			function dynamicGeneratedTables(json) {
				var columnsArray = [];
				columnsArray.push({
					field : 'male',
					title : '性别'
				}, {
					field : 'university',
					title : '学校'
				},{
					field : 'college',
					title : '院系'
				}, {
					field : 'year',
					title : '年份'
				}, {
					field : 'j',
					title : 'j值'
				});
				$('#table').bootstrapTable('destroy').bootstrapTable({
					data : json,
					striped : true,
					searchOnEnterKey : true,
					showRefresh : true,
					showToggle : true,
					showColumns : true,
					minimumCountColumns : 2,
					showPaginationSwitch : true,
					clickToSelect : true,
					detailView : false,
					detailFormatter : 'detailFormatter',
					pagination : true,
					paginationLoop : false,
					classes : 'table table-hover table-no-bordered',
					//sidePagination: 'server',
					//silentSort: false,
					smartDisplay : false,
					sortName : 'id',
					sortOrder : 'desc',
					escape : true,
					idField : 'systemId',
					maintainSelected : true,
					toolbar : '#toolbar',
					columns : columnsArray,
				});
			}

			$("#table")
					.bootstrapTable(
							{
								ajax : function(request) {
									$
											.ajax({
												type : "GET",
												url : "/joblabxtestback/ApiServlet?method=serarchStudent&university="
														+ $("#dx").val(),
												contentType : "application/json;charset=utf-8",
												dataType : "json",
												json : 'callback',
												success : function(json) {
													dynamicGeneratedTables(json);
												},
												error : function() {
													alert("请求数据失败,请检查网络状况");
												}
											});
								}
							});

		}
	</script>
</body>
</html>